<template>
  <div class="page">
    <div class="mgb-s">
      <document-panel :open="isDocumentPanelOpen" :blocks="document.data.blocks"></document-panel>
    </div>
    <div v-for="(n, i) in tasks" :key="i" class="weui-cells weui-cells_after-title mgb-s v-mdl">
      <navigator :url="'/pages/task-progresses/main?taskId=' + n.id" class="weui-cell weui-cell_access" hover-class="weui-cell_active" style="height: 68px;">
        <div v-if="n.group" class="weui-cell__hd">
          <div style="width: 47px;padding-right: 5px;">
            <avatar v-if="n.group.avatarUrl" :src="n.group.avatarUrl"></avatar>
          </div>
        </div>
        <div v-else class="weui-cell__hd">
          <div style="width: 47px;padding-right: 5px;">
            <avatar v-if="n.user" :src="n.user.avatarUrl"></avatar>
          </div>
        </div>
        <div class="weui-cell__bd pdl-s">
          <open-data class="fs-l" v-if="n.group" type="groupName" :open-gid="n.group.openGroupId"></open-data>
          <span class="fs-l" v-else>{{n.user.nickName}}</span>
          <div v-if="n.unreadCount > 0" class="weui-badge mgl" style="margin-left: 5px;">{{n.unreadCount}}</div>
        </div>
        <div class="weui-cell__ft weui-cell__ft_in-access avatars fs-xxs">
          {{n.finishCount}} 人已交
        </div>
      </navigator>
    </div>
    <div class="fix-bottom bg-white pdh-xxl pdv">
      <button class="ui btn primary s"  open-type="share"><i class="fi icon-share1"></i> 布置作业</button>
    </div>
    <page-common></page-common>
  </div>
</template>

<script>
import Avatar from '@/components/avatar'

import PageCommon from '@/components/page-common'
import { mapGetters, mapActions } from 'vuex'
import DocumentPanel from '@/components/document-panel'
import base from '@/mixins/base'
import dayjs from 'dayjs'

export default {
  mixins: [base],
  components: {
    PageCommon,
    Avatar,
    DocumentPanel
  },
  data: {
    isDocumentPanelOpen: false,
    isPageNeedAuthUser: true,
    documentId: 0
  },
  async onPullDownRefresh() {
    await this.fetchAllByDid(this.document.id)
    wx.stopPullDownRefresh()
  },
  onShareAppMessage() {
    return {
      title: this.document.name,
      path: '/pages/task-invite/main?documentId=' + this.document.id + '&distributeAt=' + dayjs().toISOString() + '&groupOwnerId=' + this.loginer.id,
      imageUrl: ''
    }
  },
  computed: {
    ...mapGetters('document', [
      'document',
      'pageDocumentId'
    ]),
    ...mapGetters('task', [
      'tasks'
    ]),
    ...mapGetters([
      'isLogined',
      'loginer'
    ]),
  },
  methods: {
    onPageShow () {
      this.setIsPageLoading(true)
    },
    async loginBack () {
      try {
        let {documentId} = this.$root.$mp.query
        if (!documentId) {
          this.setIsPageLoading(false)
          return
        }
        // if (this.pageDocumentId === documentId) return
        // this.setPageDocumentId(documentId)

        await this.fetchAllByDid(documentId)
        await this.fetchDocument(documentId)
        this.setIsPageLoading(false)
        this.isDocumentPanelOpen = this.tasks.length <= 0
        wx.setNavigationBarTitle({
          title: this.document.name
        })
      } catch (e) {
        this.$debug({err: e})
      }
    },
    ...mapActions([
      'setIsPageLoading'
    ]),
    ...mapActions('task', [
      'fetchAllByDid'
    ]),
    ...mapActions('document', [
      'fetchDocument',
      'setPageDocumentId'
    ]),
    groupBack (loginer, gid) {
    }
  }
}
</script>

<style scoped lang="less">
i {
  font-size: 26px;
}
</style>
